var color = ["#6BD98D", "#FB9A55", "#EE3E3E", "#B3C9D5", "#1AAFDE", "#07B345", "#FF8300"];
export function pieXChartFun(echartData, data) {
	let angle = 0; //角度，用来做简单的动画效果的
	//获取圆上面某点的坐标(x0,y0表示坐标，r半径，angle角度)
	function getCirlPoint(x0, y0, r, angle) {
		let x1 = x0 + r * Math.cos((angle * Math.PI) / 180);
		let y1 = y0 + r * Math.sin((angle * Math.PI) / 180);
		return {
			x: x1,
			y: y1,
		};
	}
	let formatNumber = function(num) {
		let reg = /(?=(\B)(\d{3})+$)/g;
		return num.toString().replace(reg, ',');
	};
	let option = {
		color: color,
		tooltip: {
			trigger: 'item',
			formatter: function(params) {
				// 自定义显示内容
				return params.name + '：' + params.data.count;
			}
		},
		title: {
			text: "总数量",
			left: "13.8%",
			bottom: "26%",
			textStyle: {
				fontSize: 12,
				fontWeight: 'bold',
				color: "#fff"
			}
		},
		graphic: { //图形中间文字
			type: "text",
			left: "13.8%",
			top: "32%",
			style: {
				text: "90",
				textAlign: "center",
				fill: "#fff",
				fontSize: 36,
				fontWeight: 'bold',
			}
		},
		legend: {
			orient: 'vertical',
			x: '40%',
			y: 'center',
			itemGap: 10,
			icon: 'circle',
			itemWith: 8,
			itemHeight: 8,
			align: 'left',
			textStyle: {
				color: '#EDFBFF',
				fontSize: 11,
				padding: [0, 0, 0, 0],
			},
			formatter(name) {
				let then = option.series[0].data; //获取series中的data
				let total = 0;

				for (let i = 0; i < then.length; i++) {
					if (then[i].name != '' && then[i].name != null && then[i].name != undefined) {
						total += parseInt(then[i].count);
					}
				}
				var str = '';
				var p = 0;
				for (let i = 0; i < then.length; i++) {
					if (then[i].name == name) {
						str = name + '  ' + then[i].value + '台' + '  ' + '在线率：' + then[i].value + '%';
					}
				}
				return str;
			},
		},
		series: [{
				type: 'pie',
				radius: ['60%', '74%'],
				center: ['20%', '50%'],
				data: echartData,
				hoverAnimation: false,
				labelLine: {
					normal: {
						show: false,
						length: 20,
						length2: 120,
						lineStyle: {
							color: '#e6e6e6',
						},
					},
				},
				itemStyle: {
					borderWidth: 6,
					borderColor: "#012920",
				},
				label: {
					normal: {
						show: false,
						formatter: (params) => {
							return '{icon|●}{name|' + params.name + '}{value|' + formatNumber(params
								.value) + '}';
						},
						padding: [0, -100, 25, -100],
						rich: {
							icon: {
								fontSize: 14,
							},
							name: {
								fontSize: 12,
								padding: [0, 10, 0, 4],
								color: '#666666',
							},
							value: {
								fontSize: 18,
								fontWeight: 'bold',
								color: '#333333',
							},
						},
					},
				},
			},
			{
				type: 'gauge',
				radius: '63%',
				center: ['20%', '50%'],
				label: {
					show: false
				 },
				startAngle: 0,
				endAngle: 360,
				axisLine: {
					lineStyle: {
						color: [
							[1, '#80CDA8']
						],
						width: 1
					}
				},
				axisTick: {
					show: false
				},
				splitLine: {
					show: false
				},
				axisLabel: {
					show: false
				},
				detail: {
					show: false
				},
				pointer: {
					show: false
				},
				progress: {
					show: true,
					width: 80,
					itemStyle: {
						color: {
							type: 'radial',
							x: 0.5,
							y: 0.5,
							r: 0.5,
							colorStops: [{
									offset: 0,
									color: 'RGBA(0, 127, 61, 0.3)'
								},
								{
									offset: 0.7,
									color: 'RGBA(0, 127, 61, 0.1)'
								},
								{
									offset: 1,
									color: 'RGBA(0, 127, 61, 0.8)'
								}
							]
						}
					}
				},
				data: [{
					value: 100
				}]
			},

		],
	}
	return option
}